<script type='text/javascript' language='javascript'>
var itens_escolha = new Array();
var quant_list = <?php echo $quant_list; ?> // valor vindo do back-end, controller
var url_base = "<?php echo base_url(); ?>";
var path_img_item = "<?php echo $this->config->item('path_img_item'); ?>"; // valor vindo do parser do controller
var path_img_user = "<?php echo $this->config->item('path_img_user'); ?>"; // valor vindo do parser do controller
var tipo = '';

$(document).ready(function(){
   /**
    * Verifica se existe mensagem de erro de validação
    */
   if($(".aviso")[0] && window.location.toString() == url_base + 'emprestimo/atualizar'){
       show_form('edit');
   }else if(($(".erro")[0] && window.location.toString() == url_base + 'emprestimo/cadastrar')|| ($(".aviso")[0] && window.location.toString() == url_base + 'emprestimo/cadastrar')){
       show_form();
   }
   
   /**
    * Filtrar dados do dataGrid pelo código do item
    */
   $(".codigo").click(function() {
        if(window.location.toString() == url_base + 'emprestimo/listar/cod/1/' + quant_list){
            window.location = url_base + 'emprestimo/listar/cod/2/' + quant_list;
        }else {
            window.location = url_base + 'emprestimo/listar/cod/1/' + quant_list;
        }
       return false;
   });
   
   /**
    * Filtrar dados do dataGrid pela data de saida
    */
   $(".data_saida").click(function() {
       if(window.location.toString() == url_base + 'emprestimo/listar/data_saida/1/' + quant_list){
           window.location = url_base + 'emprestimo/listar/data_saida/2/' + quant_list;
       }else {
           window.location = url_base + 'emprestimo/listar/data_saida/1/' + quant_list;
       }
       return false;
   });
   
   /**
    * Filtrar dados do dataGrid pela data de retorno
    */
   $(".data_retorno").click(function() {
       if(window.location.toString() == url_base + 'emprestimo/listar/data_retorno/1/' + quant_list){
           window.location = url_base + 'emprestimo/listar/data_retorno/2/' + quant_list;
       }else {
           window.location = url_base + 'emprestimo/listar/data_retorno/1/' + quant_list;
       }
       return false;
   });
   
   /**
    * Filtrar dados do dataGrid pelo nome do usuario
    */
   $(".usuario").click(function() {
       if(window.location.toString() == url_base + 'emprestimo/listar/user/1/' + quant_list){
           window.location = url_base + 'emprestimo/listar/user/2/' + quant_list;
       }else {
           window.location = url_base + 'emprestimo/listar/user/1/' + quant_list;
       }
       return false;
   });
   
   /**
    * Filtrar dados do dataGrid pelo status do empréstimo
    */
   $(".status").click(function() {
       if(window.location.toString() == url_base + 'emprestimo/listar/status/1/' + quant_list){
           window.location = url_base + 'emprestimo/listar/status/2/' + quant_list;
       }else {
           window.location = url_base + 'emprestimo/listar/status/1/' + quant_list;
       }
       return false;
   });
   
    /** Filtra dados QUANTIDADE **/
    $(".filter_quant").change(function() {
        window.location = url_base + 'emprestimo/listar/data_saida/2/' + $(this).val();
        return false;
    });
    
    /**
     * fecha formulario
     */
    $('#bt_cancel').click(function(){
        $("#form-insert").fadeOut();
        scroll_to('#page-content');
    });

    
    /**
     * Autocomplete para item
     */
    $(function() {
      $( "#item" ).catcomplete({
        source: url_base + "item/auto_complete_item",
          minLength: 2,      
          select: function( event, ui ) {
              // Verifica se o item já foi escolhido. Se ele estiver na lista. Abre o dialog
              if(itens_escolha.indexOf(ui.item.codigo) === -1){
                  get_item(ui.item.codigo, ui.item.tipo, ui.item.titulo);
              }else{
                  open_dialog_item(ui.item.titulo);
              }
          }, 
          close: function( event, ui ) {
               $("#item").val("");
          }
      });
    });

    $.widget( "custom.catcomplete", $.ui.autocomplete, {
          _renderMenu: function( ul, items ) {
          var that = this,
          currentCategory = "";
          $.each( items, function( index, item ) {
              if ( item.category != currentCategory ) {
                ul.append( '<li class="ui-autocomplete-category">' + item.category + '</li>' );
                currentCategory = item.category;
              }
          that._renderItemData( ul, item );
        });
      },
      _renderItem: function( ul, item ) {
        if(item.tipo == TIPO_BOOK){
            tipo = 'book';
        }else if(item.tipo == TIPO_MAGAZINE){
            tipo = 'magazine';
        }else if(item.tipo == TIPO_MIDIA){
            tipo = 'media';
        }
        return $( "<li>" )
        .append('<a><span style="float: left; padding-right: 5px;"><img src="' + url_base + path_img_item + tipo + '/thumb/' + item.image + '" width="30" height="40"/></span><strong>' + item.titulo + '</strong>\n\
        <br /><strong>Código: </strong>' + item.codigo + ' | <strong>Autor: </strong>' + item.autor + ' | <strong>Editora: </strong>' + item.editora + '</a>')
        .appendTo( ul );
       }
    });
  
    
    /** Autocomplete para Usuario **/
    $('#usuario').autocomplete({
        source: url_base + "usuario/auto_complete_usuario",
        minLength: 2,      
        select: function( event, ui ) {
            $('#usuario_id').val(ui.item.id);
        }
    }).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
      return $( "<li>" )
        .append('<a><span style="float: left; padding-right: 5px;"><img src="' + url_base + path_img_user + item.image + '" width="30" height="35"/></span><strong>' + item.value + '</strong><br />' + item.email + '</a>')
        .appendTo( ul );
    };

    /** Limpa o campo usuario_id caso seja selecionado e depois removido **/
    $('#usuario').keydown(function(){
        $('#usuario').val() == "" ? $('#usuario_id').val("") : "";
    });
    
    
    /** MASCARAS **/
    $("#data_saida, #data_retorno").mask("99/99/9999");
    
    /** DATAS **/
    $( "#data_saida" ).datepicker({
        dateFormat: 'dd/mm/yy',
        altField: "#str_data_saida",
        altFormat: "DD, 'dia' dd 'de' MM 'de' yy"
    });
    
    $( "#data_retorno" ).datepicker({
        numberOfMonths: 3,
        dateFormat: 'dd/mm/yy',
        altField: "#str_data_retorno",
        altFormat: "DD, 'dia' dd 'de' MM 'de' yy"
    });

    //Chama funcao no submit do form
    $("#form-insert-emprestimo").submit(function(){
       set_cookie_grid(); 
    });
    
    $("#new-data").click(function(){
        show_form('insert');
    });
    
    
    /** SLIDER for total entregue **/
    $( ".total_devolvido" ).slider({
        range: "min",
        value: 0, 
        min: 0,
        max: 1,
        slide: function( event, ui ) {
            $( ".str_total_devolvido" ).html('0' + ui.value + ' item');
            $("#total_devolvido").val(ui.value);
        }
    });
});

/**
 * Seleciona o item escolhido e joga os dados na lista para exibição do usuário
 */
function get_item(codigo, tipo, titulo){
    $("#loading-data").fadeIn();
    
    $.ajax({
        url: url_base + 'item/get_item_json',
        type:'POST',
        dataType: 'json',
        data: { codigo_item: codigo, tipo_item: tipo, titulo_item: titulo},
        success: function(data){
             $("#loading-data").fadeOut();
             $('#messege-alert').fadeOut();

             if(data.status_loan != false){ // Item apto para empréstimo
                  itens_escolha.push(data.item.codigo);
                  $('#itens_id').val(itens_escolha.toString());
                  //TABELA
                  $('#grid_item tbody').append(data.enquiries_table);
             }else{
                  open_dialog_item_indisponivel(data);
             }
        },
        error: function (data){ //Erro do back-end
             $("#loading-data").fadeOut();
             $("#show-alert").html(erro_message());
             scroll_to("#page-content");
        }
    });
}

/**
 * Remove item do array
 */
function remove_item(codigo){
    var index = itens_escolha.indexOf(codigo);
    itens_escolha.splice(index, 1);
    $("#itens_id").val(itens_escolha.toString());
    $("#grid_item ." + codigo + "").remove();
}

/**
 * Armazedna cookie contendo dados dos grid itens selecionados
 */ 
function set_cookie_grid(){
    destroy_cookie();
    $.cookie('data_grid_item', $("#grid_item tbody").html(), {secure: true});
}

function destroy_cookie(){
    $.cookie('data_grid_item', null);
}

/**
 * Função par abrir o form Insert ou Update de acordo com o parametro
 * 
 * @param string Nome da ação
 * Podendo ser new, erro ou sucess
 */
function show_form(action) {
    if(action == "edit"){ // UPDATE data
        $("#bt_submit").val("Atualizar Empréstimo");
        $("#form-insert-emprestimo").attr("action", url_base + "emprestimo/atualizar");
    }else if(action == "insert"){
        $("#form-insert-emprestimo").attr("action", url_base + "emprestimo/cadastrar");
        clear_form();
    }else{
        $("#bt_submit").val("Cadastrar Empréstimo");
        $("#form-insert-emprestimo").attr("action", url_base + "emprestimo/cadastrar"); 
    }
    
    //Trantando caso ocorra erro de validação
    if(!$("#messege-alert")[0]){
        scroll_to("#content-datagrid");
        destroy_cookie();
    }else if($("#messege-alert")[0] && action != 'insert'){ // Se houver erro na validação
        $('#grid_item tbody').append($.cookie('data_grid_item'));
        destroy_cookie();
        // Seta o valor dos itens escolhidos caso existam
        if(itens_escolha == 0 && $('#itens_id').val() != ""){
            itens_escolha = $('#itens_id').val().split(",");
        }
    }
    
    $("#form-insert").show('slow');
    $(".input1").focus();
}

/**
 * Exibe dialog com informações do item indisponível para empréstimo
 * 
 * @param object dados do item
 */
function open_dialog_item_indisponivel(data) {
    $("#dialog_item_not").html('<div id="item_indisponivel"><h1>' + data.item.titulo + '</h1><p><h2 style="color:#DF5757">ITEM INDISPONÍVEL para empréstimos!</h2> \n\
    <br /><b>MOTIVO:</b>' + data.status_messege + '</p></div>');
    $("#dialog_item_not").dialog({
        height: 240,
        width: 510,
        resizable: false,
        draggable: true,
        modal: true,
        buttons: {
            'Ok': function() {
                $(".input1").val("");
                $(".input1").focus();
                $(this).dialog('close');
            }
        }
    });
}

function open_dialog_item(item) {
    $("#dialog_item_not").html('<h2>O item: ' + item +'</h2><p>Já foi adicionado a lista para empréstimo.</p><p>Se desejar mais de uma quantidade do item, basta informar o total no campo designado.');
    $("#dialog_item_not").dialog({
        height: 195,
        width: 420,
        resizable: false,
        draggable: true,
        modal: true,
        buttons: {
            'Ok': function() {
                $(".input1").val("");
                $(".input1").focus();
                $(this).dialog('close');
            }
        }
    });
}

/**
 * Limpa o form e list de itens selecionadoa 
 */
function clear_form() {
    $("#grid_item tbody tr").remove(); // Limpa lista de itens selecionados
    /** LIMPA inputs **/
    $("#itens_id, #item, #usuario_id, #usuario, #data_saida, #data_retorno").val(""); // reseta input com ids dos itens
    // reseta array com itens
    itens_escolha.length = 0; 
}

/**
 * Seleciona o emprestimo
 */
function edit_loan(codigo){
    window.location = url_base + 'emprestimo/atualizar/' + codigo;
}

/*
 * Carrega os dados do emprestimo selecionada para remoção
 */   
function delete_loan(codigo) {
    if(get_code().length > 1){
        $("#codigoDelete").val(get_code());
        $("#inforDel").html('<p>Deseja realmente excluir os Empréstimos selecionadas?<br /><span style="color: #cc0000; font-size: 15px; font-weight: bold;">'  + get_code().length + ' no total.</span> <br />Uma vez excluído não será possível recuperar os dados.');
    }else{
        $("#codigoDelete").val(codigo);
        $("#inforDel").html('<p>Deseja realmente excluir o Empréstimo de código:<br /><span style="color: #cc0000; font-size: 15px; font-weight: bold;">'  + codigo + '?' + '</span> <br />Uma vez excluído não será possível recuperar os dados.');
    }
    $('#messege-alert').fadeOut();
    $("#form-insert").hide('slow'); 
    open_dialog_delete();
}


/*
 * DIALOG para confirmar remoção de emprestimo
 */
function open_dialog_delete() {
    $(".dialog-excluir").dialog({
        height: 195,
        width: 420,
        resizable: false,
        draggable: true,
        modal: true,
        buttons: {
            'Sim': function() {
                $(this).dialog('close');
                $("#form-delete-emprestimo")[0].submit();
            },
            'Não': function() {
                $(this).dialog('close');
            }
        }
    });
}
</script>
<article>
    <div id="box-search">
        <form id="search" name="search" action="<?php echo site_url('emprestimo/buscar/cod/2/' . $quant_list); ?>">
            <input type="search" name="search_term" class="input_search" placeholder="Buscar emprestimo pelo código, título do item, usuário. data de saída ou data de retorno"/>
            <a class="search_refresh" href="<?php echo site_url('emprestimo'); ?>">
                <img title="Atualiza página descartando a busca" align="center" src="<?php echo site_url('assets/img/refresh.png'); ?>"/>
            </a>
        </form>
    </div> 
    <div id="filter_item">
        <i>Quantidade por página:</i>
        <form id="quant_list">
            <?php 
                echo form_dropdown('filter_quant', array(10 => '10', 20 => '20', 30 => '30', 50 => '50'), isset($quant_list) ? $quant_list : '', 'class="filter_quant"'); 
            ?>
        </form>
    </div>
    <div id="datagrid">
        <table>
            <thead>
                <tr>
                    <th><input type="checkbox" value="1" id="select-all" name="select-all" title="Selecionar registros"></th>
                    <th><a href="" class="codigo">Código</a></th>
                    <th>Itens do empréstimo</th>
                    <th><a href="" class="usuario">Usuário</a></th>
                    <th><a href="" class="data_saida">Data da saída</a></th>
                    <th><a href="" class="data_retorno">Data do retorno</a></th>
                    <th>Total</th>
                    <th><a href="" class="status">Status</a></th>
                    <th colspan="2">Ação</th>
                </tr>
            </thead>
            <tfoot>
                <tr>
                    <td colspan="10">
                        <div id="paginacao">
                            <ul class="pagination">
                                <?php echo $pagination; ?>
                            </ul>
                        </div>
                        <div id="total-register">
                            Total: <?php echo $total_rows; ?>
                        </div>
                    </td> 
                </tr>
            </tfoot>					
            <tbody>
                <?php if(isset($emprestimos)): foreach ($emprestimos as $index => $emprestimo): ?>
                <?php 
                    //Preparando dados para a exibição
                    $status = array();
                    $item = array();
                    $total_item_loan = array();
                    foreach ($emprestimo->emprestimo_item as $key => $value){ 
                        array_push($status, $value->status);
                        array_push($item,$value->item->titulo);
                        array_push($total_item_loan, $value->total); // Para aplicar soma dos itens em cada empréstimo
                    }
                    $status_name = $value->get_status_loan($status);
                    $class_status = (date_american($emprestimo->data_retorno) < date('Y-m-d') && strtoupper($status_name) == 'ATIVO') ? 'alerta' : $status_name;
                ?>
                <tr class="pointer <?php echo strtolower($class_status); ?>" ondblclick="edit_loan(<?php echo "'" . $emprestimo->id ."'"; ?>)">
                    <td width="10">
                        <input type="checkbox" name="cod[]" value="<?php echo $emprestimo->id; ?>" class="codigoId">
                    </td>
                    <td width="60"><?php echo $emprestimo->id; ?></td>
                    <td><?php echo character_limiter(implode(', ', $item), 50); ?></td>
                    <td><?php echo $emprestimo->usuario->get_nome_completo(); ?></td>                    
                    <td title="<?php echo data_to_string($emprestimo->data_saida); ?>"><?php echo format_date($emprestimo->data_saida, TRUE, FALSE);  ?></td>
                    <td title="<?php echo data_to_string($emprestimo->data_retorno); ?>"><?php echo format_date($emprestimo->data_retorno, FALSE, FALSE); ?></td>
                    <td><?php echo string_fill(array_sum($total_item_loan), 2, 0, TRUE); ?></td>
                    <td><?php echo $status_name; ?></td>
                    <td width="20">
                        <a title="Editar registro" onclick="edit_loan(<?php echo "'" . $emprestimo->id ."'"; ?>)">
                            <img align="center" src="<?php echo site_url('assets/img/edit.png'); ?>"/>
                        </a>
                    </td>
                    <td> 
                        <a title='Excluir registro' onclick="delete_loan(<?php echo "'" . $emprestimo->id ."'"; ?>)">
                            <img align="center" src="<?php echo site_url('assets/img/delete.png'); ?>"/>
                        </a>
                    </td>
                </tr>
                <?php endforeach; endif; ?> <!-- END loop emprestimoes -->
            </tbody>
        </table>
    </div> <!-- END of #datagrid -->
</article>
<button type="button" class="button" id="new-data">Cadastrar um novo empréstimo</button>
<div id="main-content-datagrid">
    <div id="loading-data">
        <img src="<?php echo site_url('assets/img/loading.gif'); ?>" width="220" height="20"/>
    </div>
    <div id="content-datagrid">
        <section id="form-insert">
            <form action="<?php echo site_url('emprestimo/cadastrar'); ?>" id="form-insert-emprestimo" method="post" accept-charset="utf-8">
                <fieldset>
                    <legend><h3>Cadastrar Um Novo Empréstimo</h3></legend>
                    <div id="content_form" class="content_form_left">
                        <input type="hidden" name="codigo" id="codigo">
                        <label>
                            <p>Item*: <i>Adicione os itens para o empréstimo um por vez e informe a quantidade...</i></p>
                            <input type="hidden" id="itens_id" name="itens_id" value="<?php echo set_value('itens_id'); ?>"/>
                            <input class="input1" type="text" name="item" id="item" autofocus/>
                        </label>
                        <label>
                            <p>Usuário*:</p>
                            <input type="hidden" id="usuario_id" name="usuario_id" value="<?php echo set_value('usuario_id'); ?>"/>
                            <input type="text" name="usuario" id="usuario" value="<?php echo set_value('usuario'); ?>" required/>
                        </label>
                        <label>
                            <p>Data de saída*:</p>
                            <input type="text" name="data_saida" id="data_saida" value="<?php echo set_value('data_saida'); ?>" class="input_date" required/>
                            <input type="data" name="str_data_saida" id="str_data_saida" value="<?php echo set_value('str_data_saida'); ?>" disabled="disabled"/>
                        </label>
                        <label>
                            <p>Data de retorno*:</p>
                            <input type="text" name="data_retorno" id="data_retorno" value="<?php echo set_value('data_retorno'); ?>" class="input_date" required/>
                            <input type="data" name="str_data_retorno" id="str_data_retorno" value="<?php echo set_value('str_data_retorno'); ?>" disabled="disabled"/>
                        </label>
                        <input type="submit" value="Cadastrar Empréstimo" id="bt_submit" class="button">&nbsp;
                        <a id="bt_cancel" class="button pointer">Cancelar</a>
                    </div>
                </fieldset>
                <fieldset>
                    <div class="content_form_right">
                        <table id="grid_item">
                            <thead>
                                <tr>
                                    <th><h3>Itens selecionados para o empréstimo</h3></th>
                                    <th><h3>Total</h3></th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                    </div>
                </fieldset>
            </form>
        </section>
    </div>
</div>
        
        <section id="form-delete">
            <div class="dialogModal dialog-excluir">
                <h2>Atenção!</h2>
                <div id="inforDel"></div>    
            </div>
            <form action="<?php echo site_url('emprestimo/excluir'); ?>" id="form-delete-emprestimo" method="post" accept-charset="utf-8">
                    <input type="hidden" id="codigoDelete" name="codigoDelete"/>
                </form>
        </section>
        
        <div id="dialog_item_not"></div>